<template>
  <div>
    <van-submit-bar class="submitbar" button-color="linear-gradient(to right,#FD8803, #FB6A0D)"
                    :price=priceSum
                    button-text="结算" @submit="onSubmit">
      <van-checkbox v-model="checked" @change="onCheckBoxChange">全选</van-checkbox>
    </van-submit-bar>
  </div>
</template>

<script>
import Vue from 'vue';
import {SubmitBar} from 'vant';
import { Toast } from 'vant';

Vue.use(Toast);
Vue.use(SubmitBar);
export default {
  name: "submitbar",
  data() {
    return {
      checked:false,
      priceSum:0
    }
  },
  methods:{
    onSubmit(){
      Toast({
        message: '结算成功：总共'+(this.priceSum/100).toFixed(2)+"元",
        position: 'bottom',
      });
      let list=this.$store.state.cartList
      let idList=[]
      for(let n of list){
        if(n.checked) {
          idList.push(n.id)
        }
      }
      for(let n of idList){
        this.$store.commit('deleteById',n)
      }

      let sum=0
      for(let n of this.$store.state.cartList){
        if(n.checked) sum+=n.count*n.price
      }
      this.priceSum=sum
    },
    onCheckBoxChange(checked){
      this.$emit('onCheckBoxChange',checked)

      let payload={
        checked:this.checked
      }
      this.$store.commit('allChecked',payload)
    }
  },
}
</script>

<style scoped>
.submitbar {
  margin-bottom: 1.3rem;
}
</style>